Introduction to prototypes 原型介紹
在接下來的學習中，我們將開始更頻繁地動手繪製草圖，包括建立故事板（storyboards）、線框圖（wire frames）和低保真原型（low fidelity prototypes）
原型的目的
原型是一個讓設計看得見的工具，主要展示：
- 產品某個時刻是什麼樣子
- 所有可以操作的部分
- 產品上線後怎麼工作
一個原型可以展示整個使用過程，也可以只展示其中一個步驟。
原型的好處
做原型對UX設計師有很多好處：
- 把想法變成看得見的東西
- 更容易解決問題
- 根據意見不斷改進設計
- 發現可能出現的問題
- 更方便向其他人展示設計
- 在正式開發前先測試
原型怎麼用
UX設計師通常很早就開始做原型來測試想法。就算是紙上畫的原型，也很有用。
設計師會根據需要選擇不同精細度的原型。原型可以用來收集使用者意見、向別人解釋設計想法，或者在開發前跟工程師溝通。它也可能是產品釋出前的最後設計。學會做原型，是把想法變成真實產品的重要步驟。
原型設計的步驟
UX設計師在原型階段通常會做這些事：
1 整理研究結果和專案目標
設計師在這個階段已經做完初步研究。為了做原型，他們需要回顧研究結果，確保符合專案目標。主要考慮：
- 專案要達到什麼目標？
- 現在有哪些類似產品？
- 目標使用者是誰？他們需要什麼？
- 產品是什麼型別？用在什麼裝置上？
- 是否要遵循特定的設計規範？
- 專案要交付什麼？
2 畫簡單線框圖
整理好研究資料後，設計師會開始畫簡單線框圖。可以用紙筆或白板，關鍵步驟包括：
- 畫使用者流程圖：用圖形展示使用者如何完成任務。例如，圓形代表使用者動作，方形代表頁面，菱形代表選擇點，線條連線這些元素。
- 確定使用者的操作和反饋：明確使用者會做什麼、期望看到什麼，並把這些跟介面對應起來。
- 畫草圖：用草圖展示使用者流程，連線資訊結構和視覺設計，顯示頁面之間的關係。
- 搭建線框結構：加入基本的文字、圖片或影片，只是為了展示樣子，還不是真的功能。
注意：線框圖和原型不一樣。線框圖是原型的第一步，特點是靜態的、不能點選、做得快、成本低，適合團隊早期討論用。
做精細線框圖
簡單線框圖完成後，設計師會用Figma等工具把它做成電子版，變成更精細的版本。這個階段注重視覺效果、內容細節和基本互動。
做可點選原型
設計師會在精細線框圖上新增點選功能，讓它可以點選。使用者可以透過點選看到頁面、按鈕和互動是怎麼連線的。
做功能性原型
功能性原型在可點選原型基礎上加入更多互動功能，比如拖拽、滑動和動畫效果，讓它更像真實產品。
要記住，雖然原型看起來像成品，但它只是開發過程中的一個草稿，用來不斷改進，是設計流程中必不可少的一步。
重點總結
原型是設計思維中很重要的一步，它讓設計師能直觀地看到設計效果。原型也讓使用者和相關人員有機會測試和提意見，幫助設計師不斷改進，最終讓產品更好用。